

<div id="tabs">
	<ul>
		<li id="tabEl1" class="selected_tab"><a href="javascript:switch_tabs(1)">Gadget Info</a></li>
		<li id="tabEl2" ><a href="javascript:switch_tabs(2)">Author Info</a></li>
		<li id="tabEl3" ><a href="javascript:switch_tabs(3)">Profile</a></li>
		<li id="tabEl4" ><a href="javascript:switch_tabs(4)">Canvas</a></li>
		<li id="tabEl5" ><a href="javascript:switch_tabs(5)">Home</a></li>
		<li id="tabEl6" ><a href="javascript:switch_tabs(6)">Preview</a></li>
		<li id="tabEl7" ><a href="javascript:switch_tabs(7)">Spec</a></li>
		<li id="tabEl8" ><a href="javascript:switch_tabs(8)">Spec Content</a></li>
		<li id="tabEl9" ><a href="javascript:switch_tabs(9)">Spec Style</a></li>
	</ul>
</div>

<div class="tab" id="tab1">
	<div id="metadata_fields"> 
		<label class="metadata_label">Thumbnail:</label>
		<span class="metadata_field_val">
			<img src="<%= @metadata['thumbnail'] %>"/>
		</span>
		<br/>
		<label class="metadata_label">Title:</label>
		<span class="metadata_field_val"><%= @metadata['title'] %></span>
		<br/>
		<label class="metadata_label">Module ID:</label>
		<span class="metadata_field_val"><%= @metadata['moduleId'] %></span>
		<br/>
		<label class="metadata_label">iFrame URL:</label>
		<span class="metadata_field_val"><%= @metadata['iframeUrl'] %></span>
		<br/>	
		<label class="metadata_label">Height:</label>
		<span class="metadata_field_val"><%= @metadata['height'] %></span>
		<br/>
		<label class="metadata_label">Width:</label>
		<span class="metadata_field_val"><%= @metadata['width'] %></span>
		<br/>
		<label class="metadata_label">Singleton:</label>
		<span class="metadata_field_val"><%= @metadata['singleton'] %></span>
		<br/>
		<label class="metadata_label">Show in Directory:</label>
		<span class="metadata_field_val"><%= @metadata['showInDirectory'] %></span>
		<br/>
		<label class="metadata_label">User Prefs:</label>
		<span class="metadata_field_val"><%= @metadata['userPrefs'] %></span>
		<br/>
		<label class="metadata_label">Views:</label>
		<span class="metadata_field_val"><%= @metadata['views'] %></span>
		<br/><br/>
		<label class="metadata_label">JSON Encoded:</label>
		<textarea id="metadata_text"><%= @json %></textarea>
	</div>
</div>

<div class="tab" id="tab2" style="display:none;">
	<div id="metadata_fields"> 
		<label class="metadata_label">Author Email:</label>
		<span class="metadata_field_val"><%= @metadata['author_email'] %></span>
		<br/>
		<label class="metadata_label">Author Photo:</label>
		<span class="metadata_field_val"><%= @metadata['authorPhoto'] %></span>
		<br/>
		<label class="metadata_label">Author Link:</label>
		<span class="metadata_field_val">
			<a href="<%= @metadata['authorLink'] %>"><%= @metadata['authorLink'] %></a>
		</span>
	</div>
</div>

<div class="tab" id="tab3" style="display:none">
	<div id="profile_view"></div>
</div>

<div class="tab" id="tab4" style="display:none">
	<div id="canvas_view"></div>
</div>

<div class="tab" id="tab5" style="display:none">
	<div id="home_view"></div>
</div>

<div class="tab" id="tab6" style="display:none">
	<div id="preview_view"></div>
</div>

<div class="tab" id="tab7" style="display:none">
	<textarea rows="30" cols="120"><%= @xml_spec %></textarea>
</div>

<div class="tab" id="tab8" style="display:none">
	<% @xml_spec_contents.each do |content| %>
		<textarea rows="10" cols="120">
			<%= content['data'] %>
		</textarea>
	<% end %>
</div>

<div class="tab" id="tab9" style="display:none">
	<textarea rows="10" cols="120">
		<%= @xml_spec_style %>
	</textarea>
</div>
